<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
    <script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <link href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/jquery/3.4.0/jquery.min.js"></script>
    <style>
        #from
        {
            background-color: #96b97d;
            height: 1000px;
        }
        .mycenter
        {
            margin-top: 100px;
            margin-left: auto;
            margin-right: auto;
            height: 350px;
            width: 500px;
            padding: 5%;
            padding-left: 5%;
            padding-right: 5%;
        }
        .mycenter mysign
        {
            width: 440px;
        }
        .mycenter input, checkbox, button
        {
            margin-top: 2%;
            margin-left: 10%;
            margin-right: 10%;
        }
        .mycheckbox
        {
            margin-top: 10px;
            margin-left: 40px;
            margin-bottom: 10px;
            height: 10px;
        }
    </style>
    <script type="text/javascript">
        $(function () {
            $('#btn').click(function (e) {
                $.ajax({
                    url:"login",
                    type:"post",
                    data:{
                        username:$("[name='username']").val(),
                        userpwd:$("[name='userpwd']").val(),
                    },
                    success:function( a){
                        alert("登录成功");
                        location="tree";
                    }
                })
            });
        });
        //注册
        $(function () {
            $('#zhuce').click(function (e) {
                location="tozhuce"
            });
        });
        $(function () {
            $('#findpwd').click(function (e) {
                location="togetPwd"
            });
        });
    </script>

</head>
<body>
<form id="from">
    <div class="mycenter">
        <div class="mysign">
            <div class="col-lg-11 text-center text-info">
                <h2>全国青少年手球运动员登录</h2>
            </div>
            <div class="col-lg-10">
                用户名:<input type="text" class="form-control" name="username" placeholder="请输入账户名" required
                           autofocus />
            </div>
            <div class="col-lg-10">
            </div>
            <div class="col-lg-10">
                密码:<input type="password" class="form-control" name="userpwd" placeholder="请输入密码" required
                          autofocus />
            </div>
            <div class="col-lg-10">
            </div>
            <div class="col-lg-10 mycheckbox checkbox">
                <input type="checkbox" class="col-lg-1">记住密码</input>
            </div>
            <div class="col-lg-10">
            </div>
            <div class="col-lg-10">
                <button type="button" id="btn" class="btn btn-success col-lg-12">登录</button>
                <button type="button" id="zhuce" class="btn btn-success col-lg-12">注册</button>
                <button type="button" id="findpwd" class="btn btn-success col-lg-12">找回密码</button>
            </div>
        </div>
    </div>
</form>
</body>
</html>